<template>
  <div class="app-container">
    <el-container>
      <el-aside width="220px" style="background-color: white;padding: 2px;margin-bottom: 0;">
        <dept-project @selectBuilding="getCurrentProject" />
      </el-aside>
      <!--工序数据-->
      <el-main style="padding: 0 0 0 20px;">
        <el-form
          ref="queryForm"
          :model="queryParams"
          :inline="true"
          label-width="68px"
        >
          <el-form-item
            size="mini"
            label=""
          >
            <el-input
              v-model="queryValue"
              placeholder="请输入工序名称"
              clearable
              style="width: 240px"
              @input="handleQuery"
            />
          </el-form-item>
          <el-form-item size="mini">
            <el-button
              type="primary"
              size="mini"
              @click="handleAdd"
            >引入工序
            </el-button>
          </el-form-item>
          <el-form-item size="mini">
            <el-button
              type="primary"
              size="mini"
              @click="handleBatchAdd"
            >批量引入
            </el-button>
          </el-form-item>
          <el-form-item size="mini">
            <el-button
              type="primary"
              size="mini"
              @click="handleBatchDelete"
            >删除
            </el-button>
          </el-form-item>
        </el-form>

        <el-table
          ref="processTableRef"
          v-loading="loading"
          highlight-current-row
          size="small"
          :data="processList"
          height="50vh"
          show-checkbox
          @row-click="processRowClick"
          @selection-change="handleBatchSelect"
        >
          <el-table-column
            type="selection"
            width="55px"
          />
          <el-table-column
            label="序号"
            align="center"
            prop="cfseq"
            min-width="60"
          />
          <el-table-column
            label="工程项目"
            align="center"
            prop="curProjectName"
            min-width="120"
          />
          <el-table-column
            label="楼栋"
            align="center"
            prop="buildingName"
            min-width="80"
          />
          <el-table-column
            label="分部分项"
            align="center"
            min-width="80"
          >
            <template slot-scope="scope">
              <el-popover
                placement="top-start"
                trigger="click"
                :content="scope.row.cfchecktypeid | checkType"
              >
                <div slot="reference" class="ellipsis">{{ scope.row.cfchecktypeid | checkType }}</div>
              </el-popover>
            </template>
          </el-table-column>
          <el-table-column
            label="工序"
            align="center"
            min-width="120"
          >
            <template slot-scope="scope">
              <el-popover
                placement="top-start"
                trigger="click"
                :content="scope.row.checkTableName"
              >
                <div slot="reference" class="ellipsis">{{ scope.row.checkTableName }}</div>
              </el-popover>
            </template>
          </el-table-column>
          <el-table-column
            align="center"
            prop="unitTypeName"
            min-width="60"
          >
            <template slot="header">
              <el-popover
                placement="top-start"
                width="200"
                trigger="hover"
                content="验收对象"
              >
                <div slot="reference" class="ellipsis">验收对象</div>
              </el-popover>
            </template>
          </el-table-column>
          <el-table-column
            align="center"
            prop="cfcheckpercent1"
            min-width="60"
          >
            <template slot="header">
              <el-popover
                placement="top-start"
                width="200"
                trigger="hover"
                content="工程师抽查比例(%)"
              >
                <div slot="reference" class="ellipsis">工程师抽查比例(%)</div>
              </el-popover>
            </template>
          </el-table-column>
          <el-table-column
            align="center"
            prop="cfcheckpercent2"
            min-width="60"
          >
            <template slot="header">
              <el-popover
                placement="top-start"
                width="200"
                trigger="hover"
                content="监理抽查比例(%)"
              >
                <div slot="reference" class="ellipsis">监理抽查比例(%)</div>
              </el-popover>
            </template>
          </el-table-column>
          <el-table-column
            align="center"
            prop="cfcheckpercent3"
            min-width="60"
          >
            <template slot="header">
              <el-popover
                placement="top-start"
                width="200"
                trigger="hover"
                content="项目总抽查比例(%)"
              >
                <div slot="reference" class="ellipsis">项目总抽查比例(%)</div>
              </el-popover>
            </template>
          </el-table-column>
          <el-table-column
            align="center"
            prop="cfcheckpercent4"
            min-width="60"
          >
            <template slot="header">
              <el-popover
                placement="top-start"
                width="200"
                trigger="hover"
                content="项目经理抽查比例(%)"
              >
                <div slot="reference" class="ellipsis">项目经理抽查比例(%)</div>
              </el-popover>
            </template>
          </el-table-column>
          <el-table-column align="center" min-width="60">
            <template slot="header">
              <el-popover
                placement="top-start"
                width="200"
                trigger="hover"
                content="专业类别"
              >
                <div slot="reference" class="ellipsis">专业类别</div>
              </el-popover>
            </template>
            <template slot-scope="scope">
              <span>{{ scope.row.cfspecialtypeid | specialType }}</span>
            </template>
          </el-table-column>
          <el-table-column
            label="操作"
            align="center"
            width="110"
            class-name="small-padding fixed-width"
          >
            <template slot-scope="scope">
              <el-button
                v-hasPermi="['system:user:edit']"
                size="mini"
                type="text"
                icon="el-icon-edit"
                @click="handleUpdate(scope.row)"
              >修改
              </el-button>
              <el-button
                v-if="scope.row.userId !== 1"
                v-hasPermi="['system:user:remove']"
                size="mini"
                type="text"
                icon="el-icon-delete"
                @click="handleDelete(scope.row)"
              >删除
              </el-button>
            </template>
          </el-table-column>
        </el-table>

        <el-table
          highlight-current-row
          size="small"
          :data="checkPoints"
          height="calc(50vh - 170px)"
          style="margin-top: 20px;"
        >
          <el-table-column>
            <template slot="header">
              <div style="text-align: center">验收要点</div>
            </template>
            <template slot-scope="scope">
              <el-popover
                placement="top-start"
                trigger="click"
              >
                <div class="check-content">{{ scope.row.cfcheckcontent }}</div>
                <span slot="reference" class="ellipsis">{{ scope.row.cfcheckcontent }}</span>
              </el-popover>
            </template>
          </el-table-column>
          <el-table-column
            label="是否强制要求"
            align="center"
            width="160"
          >
            <template slot-scope="scope">
              <el-switch
                v-model="scope.row.cfiskey"
                :active-value="1"
                :inactive-value="0"
                disabled
                @change="handleStatusChange(scope.row)"
              />
            </template>
          </el-table-column>
        </el-table>
      </el-main>
    </el-container>

    <!-- 修改参数配置对话框 -->
    <el-dialog
      :title="title"
      :close-on-click-modal="false"
      :visible.sync="open"
      width="800px"
      append-to-body
    >
      <el-form
        ref="form"
        :model="form"
        :rules="rules"
        label-width="120px"
      >
        <el-row>
          <el-col :span="12">
            <el-form-item
              label="楼栋"
              prop="buildingName"
            >
              <el-input
                v-model="form.buildingName"
                placeholder="请输入楼栋"
                disabled
              />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item
              label="验收对象"
              prop="unitTypeName"
            >
              <el-input
                v-model="form.unitTypeName"
                placeholder="请输入"
                disabled
              />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item
              label="分部分项"
              prop="cfchecktypeid"
            >
              <el-input
                :value="form.cfchecktypeid | checkType"
                placeholder="请输入"
                maxlength="11"
                disabled
              />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item
              label="工序"
              prop="checkTableName"
            >
              <el-input
                v-model="form.checkTableName"
                placeholder="请输入邮箱"
                maxlength="50"
                disabled
              />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item
              label="工程师抽查比例"
              prop="cfcheckpercent1"
            >
              <el-input
                v-model="form.cfcheckpercent1"
                placeholder="请输入"
              >
                <template slot="append">%</template>
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item
              label="监理抽查比例"
              prop="cfcheckpercent2"
            >
              <el-input
                v-model="form.cfcheckpercent2"
                placeholder="请输入"
              >
                <template slot="append">%</template>
              </el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item
              label="项目总抽查比例"
              prop="cfcheckpercent3"
            >
              <el-input
                v-model="form.cfcheckpercent3"
                placeholder="请输入"
              >
                <template slot="append">%</template>
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item
              label="项目经理抽查比例"
              prop="cfcheckpercent4"
            >
              <el-input
                v-model="form.cfcheckpercent4"
                placeholder="请输入"
              >
                <template slot="append">%</template>
              </el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="专业类别">
              <el-select
                v-model="form.cfspecialtypeid"
                placeholder="请选择"
              >
                <el-option
                  v-for="type in specialTypes"
                  :key="type.fid"
                  :label="type.fnameL2"
                  :value="type.fid"
                />
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <div style="text-align: right;margin-bottom: 10px;">
        <el-button type="primary" @click="addCheck">新增</el-button>
      </div>
      <el-table
        highlight-current-row
        size="small"
        :data="checkList"
        height="300px"
      >
        <el-table-column>
          <template slot="header">
            <div style="text-align: center">验收要点</div>
          </template>
          <template slot-scope="scope">
            <el-popover
              placement="top-start"
              trigger="click"
            >
              <div class="check-edit-content">{{ scope.row.cfcheckcontent }}</div>
              <div slot="reference" class="ellipsis">{{ scope.row.cfcheckcontent }}</div>
            </el-popover>
          </template>
        </el-table-column>
        <el-table-column
          label="是否强制要求"
          align="center"
          width="160"
        >
          <template slot-scope="scope">
            <el-switch
              v-model="scope.row.cfiskey"
              :active-value="1"
              :inactive-value="0"
            />
          </template>
        </el-table-column>
        <el-table-column
          label="操作"
          align="center"
          width="200"
          class-name="small-padding fixed-width"
        >
          <template slot-scope="scope">
            <el-button
              size="mini"
              type="text"
              icon="el-icon-edit"
              @click="editCheck(scope.row)"
            >修改
            </el-button>
            <el-button
              size="mini"
              type="text"
              icon="el-icon-delete"
              @click="deleteCheck(scope.row)"
            >删除
            </el-button>
          </template>
        </el-table-column>
      </el-table>
      <div
        slot="footer"
        class="dialog-footer"
      >
        <el-button
          type="primary"
          @click="submitForm"
        >确 定
        </el-button>
        <el-button @click="cancel">取 消</el-button>
      </div>
      <el-dialog
        width="30%"
        :title="checkPoint.title"
        :visible.sync="checkPoint.innerVisible"
        append-to-body
      >
        <el-form label-width="120px" :model="checkPoint.form">
          <el-form-item label="是否强制要求">
            <el-switch
              v-model="checkPoint.form.cfiskey"
              :active-value="1"
              :inactive-value="0"
            />
          </el-form-item>
          <el-form-item label="要收要点">
            <el-input v-model="checkPoint.form.cfcheckcontent" :autosize="{ minRows: 2, maxRows: 6 }" type="textarea" autocomplete="off" />
          </el-form-item>
        </el-form>
        <div
          slot="footer"
          class="dialog-footer"
        >
          <el-button
            type="primary"
            @click="checkPoint.isAdd ? addCheckSubmit() : editCheckSubmit()"
          >确 定
          </el-button>
          <el-button @click="addCheckCancel">取 消</el-button>
        </div>
      </el-dialog>
    </el-dialog>
    <!-- 增加工序-->
    <el-dialog
      title="引入工序"
      :close-on-click-modal="false"
      :visible.sync="addProcess.visible"
      width="1200px"
      append-to-body
    >
      <el-row :gutter="20">
        <!--部门数据-->
        <el-col
          :span="4"
          :xs="24"
        >
          <div class="check-type">分部分项</div>
          <div class="check-type-scrollbar-container">
            <el-scrollbar style="height: 500px;">
              <el-tree
                ref="checkTypeTree"
                :data="checkTypeList"
                :props="addProcess.treeProps"
                highlight-current
                :expand-on-click-node="false"
                default-expand-all
                @node-click="addProcessNodeClick"
              />
            </el-scrollbar>
          </div>
        </el-col>
        <el-col :span="20">
          <el-table
            v-if="addProcess.visible"
            ref="oneTable"
            highlight-current-row
            size="small"
            :data="addProcess.checkTableList"
            height="530px"
            @selection-change="handleSelectionChangePre"
          >
            <el-table-column
              type="selection"
              width="55"
            />
            <el-table-column
              label="序号"
              align="center"
              prop="cfseq"
              width="60"
            />
            <el-table-column
              label="工序名称"
              align="center"
              min-width="120"
            >
              <template slot-scope="scope">
                <el-popover
                  placement="top-start"
                  trigger="click"
                >
                  <div class="check-edit-content">{{ scope.row.fnameL2 }}</div>
                  <div slot="reference" class="ellipsis">{{ scope.row.fnameL2 }}</div>
                </el-popover>
              </template>
            </el-table-column>

            <el-table-column
              label="验收对象"
              align="center"
              min-width="70"
            >
              <template slot-scope="scope">
                <span>{{ scope.row.cfunittype | unitType }}</span>
              </template>
            </el-table-column>
            <el-table-column
              align="center"
              prop="cfcheckpercent1"
              min-width="50"
            >
              <template slot="header">
                <el-popover
                  placement="top-start"
                  width="200"
                  trigger="hover"
                  content="工程师抽查比例(%)"
                >
                  <div slot="reference" class="ellipsis">工程师抽查比例(%)</div>
                </el-popover>
              </template>
            </el-table-column>
            <el-table-column
              align="center"
              prop="cfcheckpercent2"
              min-width="50"
            >
              <template slot="header">
                <el-popover
                  placement="top-start"
                  width="200"
                  trigger="hover"
                  content="监理抽查比例(%)"
                >
                  <div slot="reference" class="ellipsis">监理抽查比例(%)</div>
                </el-popover>
              </template>
            </el-table-column>
            <el-table-column
              align="center"
              prop="cfcheckpercent3"
              min-width="50"
            >
              <template slot="header">
                <el-popover
                  placement="top-start"
                  width="200"
                  trigger="hover"
                  content="项目总抽查比例(%)"
                >
                  <div slot="reference" class="ellipsis">项目总抽查比例(%)</div>
                </el-popover>
              </template>
            </el-table-column>
            <el-table-column
              align="center"
              prop="cfcheckpercent4"
              min-width="50"
            >
              <template slot="header">
                <el-popover
                  placement="top-start"
                  width="200"
                  trigger="hover"
                  content="项目经理抽查比例(%)"
                >
                  <div slot="reference" class="ellipsis">项目经理抽查比例(%)</div>
                </el-popover>
              </template>
            </el-table-column>
            <el-table-column align="center" min-width="60">
              <template slot="header">
                <el-popover
                  placement="top-start"
                  width="200"
                  trigger="hover"
                  content="专业类别"
                >
                  <div slot="reference" class="ellipsis">专业类别</div>
                </el-popover>
              </template>
              <template slot-scope="scope">
                <span>{{ scope.row.cfspecialtypeid | specialType }}</span>
              </template>
            </el-table-column>
          </el-table>
        </el-col>
      </el-row>
      <div
        slot="footer"
        class="dialog-footer"
      >
        <el-button
          type="primary"
          :loading="btnAddLoad"
          @click="addProcessSubmitForm"
        >确 定
        </el-button>
        <el-button @click="addProcessCancel">取 消</el-button>
      </div>
    </el-dialog>
    <!-- 批量引入 -->
    <el-dialog
      title="批量引入"
      :close-on-click-modal="false"
      :visible.sync="addBatchProcess.visible"
      width="1200px"
      append-to-body
    >
      <el-row :gutter="20">
        <el-col :span="8">
          <div class="check-type">楼栋信息</div>
          <el-table
            highlight-current-row
            size="small"
            :data="buildingList"
            height="530px"
            width="150px"
            @selection-change="handleBatchSelectionChange"
          >
            <el-table-column
              type="selection"
              width="55px"
            />
            <el-table-column
              label="楼栋名称"
              prop="name"
              align="left"
              min-width="50px"
            />
          </el-table>
        </el-col>
        <el-col :span="16">
          <div class="check-type">工序信息</div>
          <el-scrollbar style="height: calc(70vh - 90px);font-size: 12px;">
            <el-tree
              ref="treeType"
              :data="checkTypeListTree"
              :props="defaultProps"
              highlight-current-row
              show-checkbox
              @check-change="handleSelectionChange"
            />
          </el-scrollbar>
        </el-col>
      </el-row>
      <div
        slot="footer"
        class="dialog-footer"
      >
        <el-button
          type="primary"
          :loading="this.buttonLoading"
          @click="addProcessBatchSubmitForm"
        >确 定
        </el-button>
        <el-button @click="addProcessBatchCancel">取 消</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import {
  listCheckConfig,
  delCheckConfig,
  updateCheckConfig,
  addBatchCheckConfig,
  addBatchCheckConfigByBuildId,
  getCheckInfo,
  delCheckConfigBetch
} from '@/api/qualityManage/buildingProcess'
import { listCheckTable } from '@/api/qualityManage/checkTable'
import '@riophae/vue-treeselect/dist/vue-treeselect.css'
import { listCheckType, listSpecialType, listCheckTypeTree } from '@/api/qualityManage/checkType'
import DeptProject from './components/DeptProject'
import { getEnum, getDeptProject, buildingList } from '@/api/common'
let specialTypes = []
let checkTypeList = []
let unitTypeList = []

export default {
  name: 'BuildingProcess',
  filters: {
    specialType(id) {
      for (let i = 0; i < specialTypes.length; i++) {
        if (specialTypes[i].fid === id) {
          return specialTypes[i].fnameL2
        }
      }
      return id
    },
    checkType(id) {
      for (let i = 0; i < checkTypeList.length; i++) {
        if (checkTypeList[i].fid === id) {
          return checkTypeList[i].fnameL2
        }
      }
      return id
    },
    unitType(value) {
      for (let i = 0; i < unitTypeList.length; i++) {
        if (unitTypeList[i].value === value) {
          return unitTypeList[i].label
        }
      }
      return value
    }
  },
  components: {
    DeptProject
  },
  data() {
    return {
      deletBatch: [],
      saveParam: {
        checkConfigs: [],
        buildIds: []
      },
      deptName: '',
      expandKeys: [], // 组织项目
      deptList: [],
      defaultProps: {
        children: 'ctGcxChecktableList',
        label: function(data, node) {
          var specialTypeMap = {}
          for (let i = 0; i < specialTypes.length; i++) {
            specialTypeMap[specialTypes[i].fid] = specialTypes[i].fnameL2
          }
          return data.cfcheckpercent1 ? data.cfseq + ' - ' + data.fnameL2 + ' - ' + specialTypeMap[data.cfspecialtypeid] : data.fnumber + ' - ' + data.fnameL2 + ' - ' + specialTypeMap[data.cfspecialtypeid]
        }
      },
      buttonLoading: false,
      buildingList: [],
      type: 1,
      queryValue: '',
      // 遮罩层
      loading: false,
      // 工序表格数据
      processList: null,
      processOriginalList: [],
      // 弹出层标题
      title: '',
      // 是否显示弹出层
      open: false,
      // 表单参数
      form: {
        cfseq: '',
        projectName: '',
        buildingName: '',
        cfchecktypeid: '',
        checkTableName: '',
        unitTypeName: '',
        cfcheckpercent1: '',
        cfcheckpercent2: '',
        cfcheckpercent3: '',
        cfcheckpercent4: '',
        cfspecialtypeid: ''
      },
      // 查询参数
      queryParams: {
        cfbuildingid: ''
      },
      // 列表中的要点
      checkPoints: [],
      // 表单中要点
      checkList: [],
      // 表单校验
      rules: {
        cfcheckpercent1: [
          { required: true, message: '请输入工程师抽查比例', trigger: 'blur' }
        ],
        cfcheckpercent2: [
          { required: true, message: '请输入监理抽查比例', trigger: 'blur' }
        ],
        cfcheckpercent3: [
          { required: true, message: '请输入项目总抽查比例', trigger: 'blur' }
        ],
        cfcheckpercent4: [
          { required: true, message: '请输入项目经理抽查比例', trigger: 'blur' }
        ]
      },
      specialTypes: [],
      checkTypeList: [],
      checkTypeListTree: [],
      checkPoint: {
        title: '',
        innerVisible: false,
        isAdd: true,
        form: {
          cfcheckcontent: '',
          cfiskey: 0
        }
      },
      addProcess: {
        visible: false,
        checkTableList: [],
        treeProps: {
          children: 'children',
          label: 'fnameL2'
        }
      },

      addBatchProcess: {
        visible: false,
        checkTableList: [],
        treeProps: {
          children: 'children',
          label: 'fnameL2'
        }
      },
      multipleSelection: [],
      buildings: [],
      projectOptions: [],
      currentBuilding: {},
      buildingIds: [],
      unitTypeList: [],
      /* 引入工序点击 */
      btnAddLoad: false
    }
  },
  created() {
    getEnum('unitType').then(response => {
      this.unitTypeList = response.data.unitType
      unitTypeList = [...response.data.unitType]
    })
    this.getCheckList()
    this.getSpecialList()
    this.getCheckTableList()
  },
  methods: {
    handleBatchSelect(val) {
      this.deletBatch = val
      console.log(this.deletBatch)
    },
    handleBatchDelete() {
      console.log('11' + this.deletBatch)
      if (!this.deletBatch.length > 0) {
        console.log('222')
        this.$message.warning('请先选择工序。')
        return
      }
      var ids = ''
      this.deletBatch.forEach(e => {
        ids += e.fid + ','
      })
      if (ids.length > 0) {
        ids = ids.substr(0, ids.length - 1)
      }
      this.$confirm(
        `是否确认删除工序数据?`,
        '警告',
        {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }
      )
        .then(function() {
          return delCheckConfigBetch(ids)
        })
        .then(() => {
          this.checkList = []
          this.getList()
          this.msgSuccess('删除成功')
        })
        .catch(function() {
        })
    },
    handleCheckChange(data, checked, indeterminate) {
      console.log(data, checked, indeterminate)
    },
    // 项目节点单击事件
    handleNodeClickPro(data, node) {
      console.log(data, node)
      if (data.type === 'building') {
        // 楼栋下挂载类型：单元或房屋
        let childType = null
        if (data.children && data.children.length > 0) {
          childType = 'unit'
        }
        this.$emit('selectBuilding', { ...data, childType, project: this.selectProject })
      } else if (data.type === 'unit') {
        this.$emit('selectUnit', { ...data, building: node.parent.data })
      }
    },
    // 组织筛选节点
    filterNodeDept(value, data, node) {
      if (!value) return true
      // return data.label.indexOf(value) !== -1
      let parentNode = node.parent
      let labels = [node.label]
      let level = 1
      while (level < node.level) {
        labels = [...labels, parentNode.label]
        parentNode = parentNode.parent
        level++
      }
      return labels.some(label => label && label.indexOf(value) !== -1)
    },
    // 检索
    searchProject() {
      this.$refs.tree.filter(this.deptName)
    },
    // 组织的项目节点节点单击事件
    handleNodeClickDept(data, node) {
      console.log(data)
      this.selectProject = data
      const projectId = data.id
      if (!data.children) {
        console.log('pid_' + projectId)
        buildingList({ projectId }).then((response) => {
          this.buildingList = response.data
        })
      }
    },
    handleNodeClick(data) {
      console.log(data)
    },
    /** 查询专业类别列表 */
    getSpecialList() {
      listSpecialType({}).then(response => {
        this.specialTypes = response.data
        specialTypes = response.data
      })
    },
    /** 查询分部分项列表 */
    getCheckList() {
      listCheckType({}).then(response => {
        this.checkTypeList = response.data
        checkTypeList = response.data
      })
    },
    /** 查询楼栋工序列表 */
    getList() {
      this.loading = true
      listCheckConfig(this.queryParams).then(
        (response) => {
          this.processList = response.data
          this.processOriginalList = [...response.data]
          this.$refs.processTableRef.setCurrentRow(this.processList[0])
          if (response.data.length > 0) {
            getCheckInfo({ id: response.data[0].fid }).then((res) => {
              this.checkPoints = res.data.points
            })
          } else {
            this.checkPoints = []
          }
          this.loading = false
          this.handleQuery(this.queryValue)
        }
      ).catch(() => {
        this.loading = false
      })
    },
    // 选中工序行
    processRowClick(row, column, event) {
      console.log(row, column, event)
      getCheckInfo({ id: row.fid }).then((response) => {
        this.checkPoints = response.data.points
      })
    },
    getCurrentProject(data) {
      console.log(data)
      if (data.id) {
        this.queryParams.cfbuildingid = data.id
        this.getList()
      } else {
        this.processList = []
        this.processOriginalList = []
      }
      this.currentBuilding = data
    },
    // 取消按钮
    cancel() {
      this.open = false
      this.reset()
    },
    // 表单重置
    reset() {
      this.form = {
        cfseq: '',
        projectName: '',
        buildingName: '',
        cfchecktypeid: '',
        checkTableName: '',
        unitTypeName: '',
        cfcheckpercent1: '',
        cfcheckpercent2: '',
        cfcheckpercent3: '',
        cfcheckpercent4: '',
        cfspecialtypeid: ''
      }
      this.resetForm('form')
    },
    /** 搜索操作 */
    handleQuery(val) {
      this.processList = this.processOriginalList.filter(item => item.checkTableName && item.checkTableName.indexOf(val) !== -1)
    },
    /**
     * 新增按钮操作
     * */
    handleAdd() {
      if (!this.currentBuilding.id) {
        this.$message.warning('请先选择楼栋。')
        return
      }
      this.addProcess.visible = true
    },
    // 批量新增
    handleBatchAdd() {
      if (!this.currentBuilding.id) {
        this.$message.warning('请先选择楼栋。')
        return
      }
      const projectId = this.currentBuilding.project.id
      console.log('pid_' + projectId)
      buildingList({ projectId }).then((response) => {
        this.buildingList = response.data
      })
      console.log(DeptProject)
      getDeptProject({ type: this.type }).then((response) => {
        this.deptList = response.data
        console.log(this.deptList)
      })
      listCheckTypeTree({}).then(response => {
        this.checkTypeListTree = response.data
      })
      this.addBatchProcess.visible = true
    },
    addProcessNodeClick(data) {
      this.getCheckTableList(data.fid)
    },
    handleSelectionChangePre(val) {
      this.multipleSelection = val
    },
    handleSelectionChange(val, checked) {
      console.log(checked)
    },
    handleBatchSelectionChange(val) {
      console.log(val)
      this.buildingIds = val
    },
    addProcessSubmitForm() {
      if (this.btnAddLoad) return
      if (!this.multipleSelection.length > 0) {
        this.$message.warning('请选择勾选工序。')
        return
      }
      if (!this.currentBuilding.id) {
        this.$message.warning('请先选择楼栋。')
        return
      }
      this.btnAddLoad = true
      const select = this.multipleSelection.map(item => {
        const temp = {
          ...item,
          cfchecktableid: item.fid,
          cfbuildingid: this.currentBuilding.id,
          sellProjectId: this.currentBuilding.parentId
        }
        delete temp.fid
        return temp
      })
      console.log(select)
      addBatchCheckConfig(select).then((response) => {
        this.btnAddLoad = false
        this.getList()
        this.addProcessCancel()
      }).catch(() => {
        this.btnAddLoad = false
      })
    },

    addProcessBatchSubmitForm() {
      this.buttonLoading = true
      if (!this.buildingIds.length > 0) {
        this.$message.warning('请选择勾选楼栋。')
        this.buttonLoading = false
        return
      }
      this.multipleSelection = this.$refs.treeType.getCheckedNodes()
      if (!this.multipleSelection.length > 0) {
        this.$message.warning('请选择勾选工序。')
        this.buttonLoading = false
        return
      }
      const buildIds = this.buildingIds.map(item2 => {
        const temp2 = {
          cfbuildingid: item2.id,
          sellProjectId: item2.parentId
        }
        delete temp2.fid
        return temp2
      })
      const checkConfigs = this.multipleSelection.map(item => {
        const temp = {
          ...item,
          cfchecktableid: item.fid
        }
        delete temp.fid
        return temp
      }).filter(e => !e.ctGcxChecktableList)
      this.saveParam.buildIds = buildIds
      this.saveParam.checkConfigs = checkConfigs
      console.log(this.saveParam)
      addBatchCheckConfigByBuildId(this.saveParam).then((response) => {
        this.getList()
        this.addProcessCancel()
        this.addBatchProcess.visible = false
        this.msgSuccess('操作成功')
        this.buttonLoading = false
      }).catch(() => {
        this.buttonLoading = false
      })
    },
    addProcessCancel() {
      this.addProcess.visible = false
      this.multipleSelection = []
    },
    addProcessBatchCancel() {
      this.addBatchProcess.visible = false
      this.multipleSelection = []
      this.buildings = []
    },
    /** 查询分部分项工序列表 */
    getCheckTableList(fid) {
      listCheckTable({ cfchecktypeid: fid }).then(
        (response) => {
          this.addProcess.checkTableList = response.data
        }
      ).catch(() => {
      })
    },
    /** 修改按钮操作 */
    handleUpdate(row) {
      this.reset()
      this.open = true
      this.title = '修改工序'
      this.form = { ...row }
      getCheckInfo({ id: row.fid }).then((response) => {
        this.checkList = response.data.points
      })
    },
    // 表单要点编辑开始
    addCheck() {
      this.checkPoint.innerVisible = true
      this.checkPoint.title = '新增'
      this.checkPoint.isAdd = true
      this.checkPoint.form.cfcheckcontent = ''
      this.checkPoint.form.cfiskey = 0
    },
    addCheckSubmit() {
      this.checkList.push({ ...this.checkPoint.form })
      console.log(111)
      console.log(this.checkPoint.form)
      this.addCheckCancel()
    },
    addCheckCancel() {
      this.checkPoint.form.cfcheckcontent = ''
      this.checkPoint.form.cfiskey = 0
      this.checkPoint.innerVisible = false
    },
    editCheck(row) {
      this.checkPoint.innerVisible = true
      this.checkPoint.title = '编辑'
      this.checkPoint.isAdd = false
      this.checkPoint.currentCheck = row
      this.checkPoint.form.cfcheckcontent = row.cfcheckcontent
      this.checkPoint.form.cfiskey = row.cfiskey
    },
    editCheckSubmit() {
      this.checkPoint.currentCheck.cfcheckcontent = this.checkPoint.form.cfcheckcontent
      this.checkPoint.currentCheck.cfiskey = this.checkPoint.form.cfiskey
      this.addCheckCancel()
    },
    deleteCheck(row) {
      this.$confirm('此操作将删除该要点, 是否继续?', '删除提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        for (let i = 0; i < this.checkList.length; i++) {
          if (this.checkList[i].cfiskey === row.cfiskey && this.checkList[i].cfcheckcontent === row.cfcheckcontent) {
            this.checkList.splice(i, 1)
            return
          }
        }
      })
    },
    // 表单要点编辑结束

    /** 提交按钮 */
    submitForm: function() {
      this.$refs['form'].validate((valid) => {
        if (valid) {
          this.form.points = this.checkList
          console.log(this.form)
          updateCheckConfig(this.form).then((response) => {
            if (response.code === 200) {
              this.msgSuccess('修改成功')
              this.open = false
              this.getList()
            }
          })
        }
      })
    },
    /** 删除按钮操作 */
    handleDelete(row) {
      this.$confirm(
        `是否确认删除序号：${row.cfseq}工序数据?`,
        '警告',
        {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }
      )
        .then(function() {
          return delCheckConfig(row.fid)
        })
        .then(() => {
          this.checkList = []
          this.getList()
          this.msgSuccess('删除成功')
        })
        .catch(function() {
        })
    }
  }
}
</script>
<style type="scss" scoped>
  .tree-box {
    box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.1)
  }
  .aside-scrollbar {
    height: calc(100vh - 150px);
  }
  .ellipsis {
    width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    cursor: pointer;
  }
  .check-content {
    max-width: 50vw;
    font-size: 12px;
    color: #606266;
  }
  .check-edit-content {
    max-width: 600px;
    font-size: 12px;
    color: #606266;
  }
  .check-type {
    font-size: 14px;
    color: #606266;
    padding: 10px;
    border-bottom: 1px solid #dcdfe6;
  }
  .org-pro-tree {
    height: 600px;
    overflow: auto;
  }

  .user-list {
    height: 600px;
    border: 1px solid #3a71a8;
  }

  .auth-title {
    background: #999999;
    padding-left: 20px;
    line-height: 35px;
    color: white;
  }
</style>
<style lang="scss">
  .check-type-scrollbar-container,
  .aside-tree-container {
    .el-scrollbar .el-scrollbar__wrap {
      overflow-x: hidden;
    }
  }
</style>
